<div id="headcontent" class="content" style="height:300px;">
  <div id="logo" style="width:200px;position:relative;float:left;padding-top:20px;padding-bottom:20px;"> <img src="".$template->img_path(get_class($mdl))."/Logo-wtcode21.png" style="width:200px;"> </div>
  <div style="width:230px;float:left;height:255px;" id="datablock">
      <div class="shadow" id="data" style="width:100%;background-color:#CDDACD;height:145px;display:none;padding: 20px 0 0 20px;cursor:pointer;">
          <div style="height:125px;overflow:hidden;" id="jobs" title="Работы">".$mdl->projects()."</div>
      </div>
      <div class="shadow" style="height:70px;width:100%;padding: 20px 0 0 20px;margin-top:20px;background-color:#E2E2E2;" id="login">
      	  <a href="#">Вход</a>
      </div>
  </div>
  <div id="badge" class="shadow" style="width:380px;display:none;height:255px;background-color:#e8e8c5;margin-left:270px;padding: 20px 0 0 20px;"> 
    <!-- Facebook Badge START --><a href="http://ru-ru.facebook.com/godoflife" target="_TOP" title="Stas Borisov"><img src="http://badge.facebook.com/badge/1194990375.2675.1931003290.png" width="360" height="233" style="border: 0px;"></a><!-- Facebook Badge END --> 
  </div>
</div>
<script type="text/javascript">
  $('#logo').css({ opacity: 0 });
  $('#login').css({ opacity: 0 });
  $('#logo').animate({left: '+=700',opacity: 1},'slow',function(){
		$('#logo').css({float:'right',left:'0'});
		$('#badge').slideDown('slow',function(){
			$('#data').slideDown('slow',function(){
				$('#login').animate({opacity: 1},'fast');
			});
		});
  });
  $(function() {
	$('#jobs a').lightBox({fixedNavigation:true});
  });
  $('#login a').click(function(){
   $.ajax({
     type:'GET',
     url: '?mdl=testmdl&func=login',
     dataType: 'json',
     success: function(data){
       if(data.login == 'pass'){
         $('#logo').animate({ top: '-=200'},'slow');
         $('#badge').slideUp('slow');
         $('#data').slideUp('slow',function(){
          $('#login').animate({marginTop:'-=40'},'slow',function(){            
                  $('#datablock').animate({width:'+=400'},'slow');          
                });
         });
         $('#login').html(data.result);
       }
     }
   });
  });
</script>